<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<br />
<br />
<br />
<input id="input" type="text" value="JavaScript To App"/>
<br />
<button onclick="sendToApp(input.value.toString())" />发送</button>
<br />
<br />
<br />
<span >接收到APP的消息:</span>
<br />
<span id="text_title"></span>
<br />
<span id="text"></span>
<br />
<br />
<br />
<br />
<br />
<br />
<a href="http://gdown.baidu.com/data/wisegame/0d5a2f3c0e6b889c/qunaerlvxing_146.apk" download="qunaerlvxing_146.apk">下载</a>
<br />
<br />
<br />
<img src="https://www.baidu.com/img/bd_logo1.png" width="270" height="130">

<script>
    let appAndJsPort;
    window.addEventListener('message', function(event) {
        console.log('收到message: '+event.data);
        if (event.data === 'welfare_game_interface' && event.ports[0] != null && event.ports[0] !== undefined) {
            appAndJsPort = event.ports[0];
            appAndJsPort.onmessage = function (event) {
                receiveFromApp(event.data);
            };
            // 获取登录信息等，调用APP中的方法
            sendToApp('getLoginId');
            sendToApp('getUserInfo');
            sendToApp('getAppVersionExtra');
            sendToApp('getDeviceExtra');
        }
    }, false);

    /**
     * 发送消息到App
     * @param msg：字符串
     */
    function sendToApp(msg){
        console.log('发送到app: '+msg);
        if (appAndJsPort==null && appAndJsPort===undefined) {
            return;
        }
        appAndJsPort.postMessage(msg);
    }

    /**
     * 收到APP的消息
     * @param msg: 字符串
     * {"methodName":"getAppVersionExtra","resultData":"{\"appChannel\":\"IOS\",\"appVersionName\":\"5.2.2.8\",\"appVersion\":\"150\"}"}
     */
    function receiveFromApp(msg){
        console.log('收到app: '+msg);
<!--        if (msg!=null && msg!==undefined && msg instanceof String){-->
            const data = JSON.parse(msg);
            document.getElementById('text_title').innerHTML = data.methodName;
            document.getElementById('text').innerHTML  = data.resultData;
<!--        }-->
    }

</script>
</body>
</html>